<!DOCTYPE html>
<html lang="en">
    <head>
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" charset="UTF-8">
        <title>Title</title>

        <link rel="stylesheet" href="../css/bootstrap.css">
        <link rel="stylesheet" href="../css/bootstrap-table.min.css">

        <script src="../js/jquery-3.3.1.js"></script>
        <script src="../js/bootstrap.bundle.min.js"></script>
        <script src="../js/bootstrap-table.min.js"></script>
        <script src="../js/bootstrap-table-zh-CN.min.js"></script>
        <script src="../js/menu.js"></script>

        <style>
            body {
                background-color: #d1ecf1;
            }
        </style>
    </head>
    <body>
        <div style="width: 90%">
            <div style="margin-left: 30px;">
                <div style="margin-top: 20px;" class="text-left">
                    <h2>菜单信息</h2>
                    <hr color="red" width="80%" align="left" size="1"/>
                    <input type="button" class="btn btn-warning" value="添加" onclick="LoadRoleAdd()" data-toggle="modal"
                           data-target="#exampleModal">
                    <input type="text" id="menuname" class="text-dark" style="width:200px;height: 41px;"
                           placeholder="输入菜单名称">
                    <input type="button" class="btn btn-success" value="查询" onclick="page()">
                </div>
                <div style="padding-top:10px;">
                    <table id="tab_data" class="table  table-bordered  thead-dark" style="width: 90%;">
                    </table>
                </div>
            </div>
        </div>
        <!-- Modal -->
        <div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel"
             aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <form method="post" id="AddUpDate" enctype="multipart/form-data">
                        <div class="modal-body">
                            <div name="AuthHidden" hidden>
                                <div class="form-group">
                                    <label class="col-form-label">菜单编号:</label>
                                    <input type="text" readonly name="menuid" class="form-control">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-form-label">菜单名称:</label>
                                <input type="text" name="menuname" class="form-control">
                            </div>
                            <div class="form-group">
                                <label class="col-form-label">菜单URL:</label>
                                <input type="text" name="menuurl" class="form-control">
                            </div>
                            <div class="form-group">
                                <label class="col-form-label">菜单target:</label>
                                <input type="text" name="mentarget"  class="form-control">
                            </div>
                            <div class="form-group">
                                <label class="col-form-label">菜单的父级:</label>
                                <select name="parentid" class="form-control"></select>
                            </div>
                            <div name="AuthHidden" hidden>
                                <div class="form-group">
                                    <label class="col-form-label">菜单状态:</label>
                                    <div id="status" style="margin-left: 20px;margin-top:10px;height: 30px;" class="text-left">
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button>
                            <button type="submit" class="btn btn-primary">提交</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>

        <!-- 确认删除模态款 -->
        <div class="modal fade" id="delModal" data-backdrop="static" data-keyboard="false" tabindex="-1"
             aria-labelledby="staticBackdropLabel"
             aria-hidden="true">
            <div class="modal-dialog  modal-dialog-centered">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title" id="staticBackdropLabel">警告提示！</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        是否要删除这条数据？
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button>
                        <button type="button" id="delSubmit" class="btn btn-primary">确认</button>
                    </div>
                </div>
            </div>
        </div>
    </body>
</html>